<template>
  <div v-if="data">
    <!-- ------------ 用户信息栏 ------------------------ -->
      <div class="partTitle"><span></span><p>{{$t('loanMoneyDetail.userInfor')}}</p></div>
      <ul class="infotable clearfix">
        <li><span class="label">{{$t('new.no48')}}</span><span class="val">{{data.userBase.appName | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.appPackage')}}</span><span class="val">{{data.userBase.appPackage | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('proManage.partnerName')}}</span><span class="val">{{data.order.orderExtra?data.order.orderExtra.partnerName:'-'}}</span></li>
        <li><span class="label">&nbsp;</span><span class="val">&nbsp;</span></li>
        <li><span class="label">{{$t('public.userId')}}</span><span class="val">{{data.userBase.id | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.name')}}</span><span class="val">{{data.userBase.name | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.registerDate')}}</span><span class="val">{{data.userBase.regTime | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.registerChannel')}}</span><span class="val">{{data.userBase.regChannel | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.userPhone')}}</span><span class="val">{{data.userBase.phone | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.sex')}}</span><span class="val">{{$t($store.getters.sexStatus(data.userBase.sex))}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.no2')}}</span><span class="val">{{data.userSelf.idCard | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('yuenan.no1')}}</span><span class="val">{{data.userSelf.idCardAwardTime | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('yuenan.no2')}}</span><span class="val">{{data.userSelf.liveProvinceId | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('yuenan.no17')}}</span><span class="val">{{data.userSelf.liveCityId | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('yuenan.no3')}}</span><span class="val">{{data.userSelf.liveRegionId | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">&nbsp;</span><span class="val">&nbsp;</span></li>
        <li class="colfull"><span class="label">{{$t('public.no63')}}</span><span class="val">{{data.userSelf.liveAddress | dataIsTrue}}&nbsp;</span></li>
    </ul>
    <!-- ------------ 借款订单详情栏 ------------------------ -->
    <div class="partTitle mt30"><span></span><p>{{$t('loanMoney.orderDetail')}}</p></div>
    <ul class="infotable clearfix">
        <li><span class="label">{{$t('new.no48')}}</span><span class="val">{{data.userBase.appName | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.appPackage')}}</span><span class="val">{{data.userBase.appPackage | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('proManage.partnerName')}}</span><span class="val">{{data.order.orderExtra?data.order.orderExtra.partnerName:'-'}}</span></li>
        <li><span class="label">&nbsp;</span><span class="val">&nbsp;</span></li>
        <li><span class="label">{{$t('public.orderNo')}}</span><span class="val">{{data.order.orderNo | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.CreateDate')}}</span><span class="val">{{data.order.createTime | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.no58')}}</span><span class="val">{{data.order.loanTime | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.CreateTime')}}</span><span class="val">{{data.order.mustRefundTime | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.no24')}}</span><span class="val">{{$store.state.common.id_currency}}{{$store.getters.moneySplit(data.order.loanAmount)}}{{$store.state.common.vi_currency}}</span></li>
        <li><span class="label">{{$t('public.no31')}}</span><span class="val">{{data.order.productPeriod | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('proManage.dayInterest')}}</span><span class="val">{{$store.getters.twoPoint(data.order.dayInterestRate)}}&nbsp;</span></li>
        <li><span class="label">{{$t('proManage.feeRate')}}</span><span class="val">{{$store.getters.twoPoint(data.order.feeRate)}}&nbsp;</span></li>
        <li><span class="label">{{$t('public.no28')}}</span><span class="val">{{data.order.overdueDays | dataIsTrue}}&nbsp;</span></li>
        <li><span class="label">{{$t('loanMoneyDetail.overdueInterest')}}</span><span class="val">{{$store.state.common.id_currency}}{{$store.getters.moneySplit(data.order.overdueInterest)}}{{$store.state.common.vi_currency}}</span></li>
        <li><span class="label">{{$t('loanMoneyDetail.currentInterest')}}</span><span class="val">{{$store.state.common.id_currency}}{{$store.getters.moneySplit(data.order.currentInterest)}}{{$store.state.common.vi_currency}}</span></li>
        <li><span class="label">{{$t('loanMoneyDetail.feeAmount')}}</span><span class="val">{{$store.state.common.id_currency}}{{$store.getters.moneySplit(data.order.feeAmount)}}{{$store.state.common.vi_currency}}</span></li>
        
        <li><span class="label">{{$t('public.no27')}}</span><span class="val">{{$store.state.common.id_currency}}{{$store.getters.moneySplit(data.order.dueAmount)}}{{$store.state.common.vi_currency}}</span></li>
        <li><span class="label">{{$t('public.no65')}}</span><span class="val">{{$store.state.common.id_currency}}{{$store.getters.moneySplit(data.order.refundAmount)}}{{$store.state.common.vi_currency}}</span></li>
        <li><span class="label">{{$t('public.no66')}}</span><span class="val">{{data.order.lastRefundTime | dataIsTrue}}</span></li>
        <li><span class="label">&nbsp;</span><span class="val">&nbsp;</span></li>

        <li><span class="label">{{$t('yuenan.no18')}}</span><span class="val">{{data.userBank.accountType | dataIsTrue}}</span></li>
        <li><span class="label">{{$t('public.no19')}}</span><span class="val">{{data.userBank.bankName | dataIsTrue}}</span></li>
        <li><span class="label">{{$t('public.no20')}}</span><span class="val">{{data.userBank.bankAccount | dataIsTrue}}</span></li>
        <li><span class="label">{{$t('yuenan.no19')}}</span><span class="val">{{data.userBank.email | dataIsTrue}}</span></li>
        
        <!-- <li><span class="label">{{$t('filter.couponName')}}</span><span class="val">{{data.coupon.couponName | dataIsTrue}}</span></li>
        <li><span class="label">{{$t('filter.couponItem')}}</span><span class="val">{{$t($store.getters.couponTypeState(data.coupon.couponType))}}</span></li>
        <li><span class="label">{{$t('filter.couponCon')}}</span><span class="val">{{data.userBank.bankAccount | dataIsTrue}}</span></li>
        <li><span class="label">{{$t('filter.interest')}}</span><span class="val">{{$store.getters.moneySplit(data.order.couponAmount)}}</span></li> -->
        
        <li class="colfull"><span class="label">{{$t('public.no34')}}</span><span class="val">{{data.order.orderAddress | dataIsTrue}}</span></li>

    </ul>

    <!-- ------------  审核记录栏  ------------------------ -->
    <div class="partTitle mt30"><span></span><p>{{$t('loanMoneyDetail.opeHistory')}}</p></div>
      <el-table :data="data.orderLogList" class="mt20">
        <el-table-column prop="adminName" :label="$t('loanMoneyDetail.opePeople')"></el-table-column>
        <el-table-column  prop="operationType" :label="$t('loanMoneyDetail.opeType')">
        </el-table-column>
        <el-table-column prop="operationTime" :label="$t('loanMoneyDetail.opeTime')">
        </el-table-column>
        <el-table-column prop="operationName" :label="$t('loanMoneyDetail.opeType2')">
        </el-table-column>
        <el-table-column prop="result" :label="$t('loanMoneyDetail.opeResult')">
        </el-table-column>
        <el-table-column prop="remark" :label="$t('public.no37')"></el-table-column>
      </el-table>
    </div>
  <div v-else class="back">
    <p>{{$t('public.no23')}}，<span @click="back">{{$t('back.no1')}}</span> {{$t('back.no2')}}</p>
  </div>
</template>
<script>
export default {
  name: 'orderDetail',
  data () {
    return {
      data: {
        userBase: '',
        userBank: '',
        userSelf: '',
        order: '',
        // coupon: '',
        orderLogList: [],
        orderLendingList: [],
        orderPhoneApprove: [],
        orderRepaymentList: []
      }
    }
  },
  methods: {
    detail () {
      this.$axios.post(this.$action.loan_loanDetail+this.orderId).then(res => {
        if (res.code == 200) {
          this.data.userBase = res.data.user;
          this.data.userBank = res.data.userBank?res.data.userBank:{};
          this.data.userSelf = res.data.userSelf?res.data.userSelf:{};
          this.data.order = res.data.order?res.data.order:{};
          this.data.orderLogList = res.data.orderLogList;
          this.data.orderLendingList = res.data.orderLendingList;
          this.data.orderPhoneApprove = res.data.orderPhoneApprove;
          this.data.orderRepaymentList = res.data.orderRepaymentList;
          // this.data.coupon = res.data.userCoupon?res.data.userCoupon:{};
        }
      })
    },
    back () { // 页面无数据时，点击返回
      window.history.go(-1)
    }
  },
  mounted () {
    this.orderId = this.$route.query.orderId
    this.detail()
  }
}
</script>
<style scoped lang="scss">
  .infotable{
      font-size: 14px;
      margin:20px;
      @include infoTable(4,0.5,0.5)
  }

.back{
  width: 100%;
  height: 100%;
  padding: 20px 30px;
  background-color: rgba(246, 249, 252, 1);
  position: relative;
  @include flex-cen;
  p{
    span{
      font-size: 18px;
      padding: 0 5px;
      font-weight: bold;
      cursor: pointer;
    }
  }
}
</style>
